<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>
<script>
    const obj = {
        id: 1,
        name: 'zhangsan',
        age: 12,
    }
    // 1. 读取属性
    console.log(obj.id);

    // 2. 修改
    obj.age = 22;
    // 3. 删除
    delete obj.name;
    // 4. 添加
    obj.address = '广州市';

    console.log(obj);

    for (const key in obj) {
        console.log('对象的属性', key, ' 对象的属性值：', obj[key]);
    }


    /* 对象的属性为什么可以被读取，修改，以及遍历
        在javascript内部，存在对属性进行描述的 api ，做了相关的定义

        Object.getOwnPropertyDescriptor(obj, key) 用于获取对象的某个属性的描述信息

    */

    /**
     {
        configurable: true 决定这个属性是否可以被删除
        enumerable: true 决定属性是否可以被枚举（for in 进行遍历）
        value: 1 属性的值
        writable: true 属性是否可以被修改
     }
     */
    let info = Object.getOwnPropertyDescriptor(obj, 'id');
    console.log(info);

    /* 需求：对象的属性默认是可以被修改，可以被枚举，可以被删除

    1. 希望 obj 对象的 age 属性不能被修改
    2. 然后 id 属性不能被枚举
    3. address 属性不能被删除
     */
    /* 描述  obj 对象的 age 属性不能修改 */

    Object.defineProperty(obj, 'age', {
        writable: false,
    });

    Object.defineProperty(obj, 'id', {
        /* 描述  obj 对象的 id 属性不能枚举 */
        enumerable: false,
    });

    Object.defineProperty(obj, 'address', {
        configurable: false,
    });

    console.log('尝试修改 obj 的 age 属性');

    obj.age = 12;
    console.log(obj);

    delete obj.address;

    console.log('尝试枚举 obj 的 id 属性');
    for (let attr in obj) {
        console.log('obj的属性：', attr);
    }


</script>


</html>